<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Cart</title>
    <script src="lib/jquery/dist/jquery.min.js"></script>
    <script src="lib/vue/dist/vue.min.js"></script>
    <link href="lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
    <script src="lib/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="js/index.js"></script>
</head>
<body>

        <div id="mycart">
                <div class="panel panel-info" style="margin:20px;">
                   <!-- 头部 -->
                  <div class="panel-heading">
                      <h1 style="display: inline-block;"><span v-text="name"></span> 的购物车</h1>
                      <br><span>清单总数
                        <span class="label label-warning" >{{carts.length}}</span>
                      </span>
                  </div>
                  <!-- 内容 -->
                  <div class="panel-body">
                      <div class="input-group">
                        <input class="form-control" type="text" v-model="myitem" /> 
                        <span class="input-group-btn">
                          <button class="btn btn-primary" @click="add(myitem)"  :disabled="myitem == ''">添加</button>
                        </span>
                      </div>
                      <table class="table table-striped">
                        <thead>
                          <tr>
                            <th>名称</th>
                            <th>数量</th>
                            <th>付款</th>
                            <th>操作</th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr v-for="(v,index) in carts">
                            <td>{{v.item}}</td>
                            <td>{{v.qty}}</td>
                            <td>{{v.payflg | payFilter}}</td>
                            <td><button type="button" class="btn btn-danger btn-sm" @click="del(index)">删除</button></td>
                          </tr>
                        </tbody>
                      </table>
                  </div>
                </div>
                     
              </div>


    <!-- <script data-main="js/main" src="lib/requirejs/require.js"></script> -->
</body>
</html>